import 'package:flutter/material.dart';
import 'package:hrcapp/screens/charity_screen.dart';
import '../../utils/theme_colors.dart';
import 'package:flutter_svg/flutter_svg.dart';

class HeritageActivitiesScreen extends StatefulWidget {
  const HeritageActivitiesScreen({super.key});

  @override
  _HeritageActivitiesScreenState createState() => _HeritageActivitiesScreenState();
}

class _HeritageActivitiesScreenState extends State<HeritageActivitiesScreen>
    with SingleTickerProviderStateMixin {
  late TabController _tabController;
  int _currentIndex = 0;

  final List<String> _tabTitles = [
    '活动首页',
    '公益慈善',
    '文化展览',
    '教育培训',
    '社区交流',
  ];

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: _tabTitles.length, vsync: this);
    _tabController.addListener(() {
      setState(() {
        _currentIndex = _tabController.index;
      });
    });
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('非遗活动'),
        backgroundColor: ThemeColors.primary,
        elevation: 0,
        centerTitle: true,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back_ios, size: 16, color: Colors.white),
          onPressed: () {
            Navigator.pop(context);
          },
        ),
        actions: [
          IconButton(
            icon: const Icon(Icons.search, size: 16, color: Colors.white),
            onPressed: () {
              // 搜索功能
            },
          ),
          IconButton(
            icon: const Icon(Icons.notifications, size: 16, color: Colors.white),
            onPressed: () {
              // 通知功能
            },
          ),
          const SizedBox(width: 8),
        ],
        bottom: TabBar(
          controller: _tabController,
          isScrollable: true,
          indicatorColor: Colors.white,
          indicatorWeight: 3,
          labelColor: Colors.white,
          unselectedLabelColor: Colors.white70,
          labelStyle: const TextStyle(
            fontSize: 14,
            fontWeight: FontWeight.w600,
          ),
          unselectedLabelStyle: const TextStyle(
            fontSize: 14,
            fontWeight: FontWeight.normal,
          ),
          tabs: _tabTitles.map((title) => Tab(text: title)).toList(),
        ),
      ),
      body: TabBarView(
        controller: _tabController,
        children: [
          _buildActivityHomePage(),
          const CharityScreen(), // 整合现有的慈善功能
          _buildCulturalExhibitionPage(),
          _buildEducationTrainingPage(),
          _buildCommunityPage(),
        ],
      ),
    );
  }

  // 活动首页
  Widget _buildActivityHomePage() {
    return SingleChildScrollView(
      child: Column(
        children: [
          // 轮播图
          _buildActivityBanner(),
          // 热门活动
          _buildHotActivities(),
          // 活动分类
          _buildActivityCategories(),
          // 最新活动
          _buildLatestActivities(),
        ],
      ),
    );
  }

  // 活动轮播图
  Widget _buildActivityBanner() {
    return Container(
      height: 200,
      margin: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(16),
        gradient: LinearGradient(
          begin: Alignment.topLeft,
          end: Alignment.bottomRight,
          colors: [
            ThemeColors.primary,
            ThemeColors.secondary,
          ],
        ),
        boxShadow: [
          BoxShadow(
            color: ThemeColors.primary.withOpacity(0.3),
            blurRadius: 10,
            offset: const Offset(0, 4),
          ),
        ],
      ),
      child: Stack(
        children: [
          Positioned(
            right: -20,
            top: -20,
            child: Container(
              width: 120,
              height: 120,
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                color: Colors.white.withOpacity(0.1),
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(24),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                const Text(
                  '非遗文化传承',
                  style: TextStyle(
                    fontSize: 24,
                    fontWeight: FontWeight.bold,
                    color: Colors.white,
                  ),
                ),
                const SizedBox(height: 8),
                const Text(
                  '参与非遗活动，传承千年文化',
                  style: TextStyle(
                    fontSize: 16,
                    color: Colors.white70,
                  ),
                ),
                const SizedBox(height: 16),
                ElevatedButton(
                  onPressed: () {},
                  style: ElevatedButton.styleFrom(
                    backgroundColor: Colors.white,
                    foregroundColor: ThemeColors.primary,
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(20),
                    ),
                  ),
                  child: const Text('立即参与'),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  // 热门活动
  Widget _buildHotActivities() {
    final activities = [
      {
        'title': '苏绣技艺体验',
        'subtitle': '传统刺绣工艺学习',
        'participants': '128人参与',
        'icon': Icons.palette,
      },
      {
        'title': '古琴音乐会',
        'subtitle': '传统音乐欣赏',
        'participants': '89人参与',
        'icon': Icons.music_note,
      },
      {
        'title': '木雕工艺坊',
        'subtitle': '传统雕刻技艺',
        'participants': '67人参与',
        'icon': Icons.handyman,
      },
    ];

    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '热门活动',
            style: TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
              color: ThemeColors.textPrimary,
            ),
          ),
          const SizedBox(height: 12),
          SizedBox(
            height: 120,
            child: ListView.builder(
              scrollDirection: Axis.horizontal,
              itemCount: activities.length,
              itemBuilder: (context, index) {
                final activity = activities[index];
                return Container(
                  width: 200,
                  margin: const EdgeInsets.only(right: 12),
                  padding: const EdgeInsets.all(16),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(12),
                    boxShadow: [
                      BoxShadow(
                        color: Colors.black.withOpacity(0.05),
                        blurRadius: 8,
                        offset: const Offset(0, 2),
                      ),
                    ],
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Row(
                        children: [
                          Icon(
                            activity['icon'] as IconData,
                            color: ThemeColors.primary,
                            size: 20,
                          ),
                          const SizedBox(width: 8),
                          Expanded(
                            child: Text(
                              activity['title'] as String,
                              style: TextStyle(
                                fontSize: 14,
                                fontWeight: FontWeight.w600,
                                color: ThemeColors.textPrimary,
                              ),
                            ),
                          ),
                        ],
                      ),
                      const SizedBox(height: 8),
                      Text(
                        activity['subtitle'] as String,
                        style: TextStyle(
                          fontSize: 12,
                          color: ThemeColors.textSecondary,
                        ),
                      ),
                      const Spacer(),
                      Text(
                        activity['participants'] as String,
                        style: TextStyle(
                          fontSize: 11,
                          color: ThemeColors.primary,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                    ],
                  ),
                );
              },
            ),
          ),
        ],
      ),
    );
  }

  // 活动分类
  Widget _buildActivityCategories() {
    final categories = [
      {'name': '技艺体验', 'icon': Icons.handyman, 'count': '12'},
      {'name': '文化讲座', 'icon': Icons.school, 'count': '8'},
      {'name': '展览参观', 'icon': Icons.museum, 'count': '15'},
      {'name': '互动交流', 'icon': Icons.forum, 'count': '6'},
    ];

    return Container(
      margin: const EdgeInsets.all(16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '活动分类',
            style: TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
              color: ThemeColors.textPrimary,
            ),
          ),
          const SizedBox(height: 12),
          GridView.builder(
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              childAspectRatio: 2.5,
              crossAxisSpacing: 12,
              mainAxisSpacing: 12,
            ),
            itemCount: categories.length,
            itemBuilder: (context, index) {
              final category = categories[index];
              return Container(
                padding: const EdgeInsets.all(16),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(12),
                  border: Border.all(
                    color: ThemeColors.primary.withOpacity(0.2),
                  ),
                ),
                child: Row(
                  children: [
                    Icon(
                      category['icon'] as IconData,
                      color: ThemeColors.primary,
                      size: 24,
                    ),
                    const SizedBox(width: 12),
                    Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(
                            category['name'] as String,
                            style: TextStyle(
                              fontSize: 14,
                              fontWeight: FontWeight.w600,
                              color: ThemeColors.textPrimary,
                            ),
                          ),
                          Text(
                            '${category['count']}个活动',
                            style: TextStyle(
                              fontSize: 12,
                              color: ThemeColors.textSecondary,
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              );
            },
          ),
        ],
      ),
    );
  }

  // 最新活动
  Widget _buildLatestActivities() {
    final activities = [
      {
        'title': '景德镇陶瓷制作体验',
        'time': '2024-01-20 14:00',
        'location': '景德镇陶瓷博物馆',
        'status': '报名中',
      },
      {
        'title': '传统剪纸艺术工作坊',
        'time': '2024-01-22 10:00',
        'location': '民间艺术中心',
        'status': '即将开始',
      },
      {
        'title': '非遗文化摄影展',
        'time': '2024-01-25 09:00',
        'location': '文化艺术馆',
        'status': '报名中',
      },
    ];

    return Container(
      margin: const EdgeInsets.all(16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '最新活动',
            style: TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
              color: ThemeColors.textPrimary,
            ),
          ),
          const SizedBox(height: 12),
          ...activities.map((activity) => Container(
            margin: const EdgeInsets.only(bottom: 12),
            padding: const EdgeInsets.all(16),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(12),
              boxShadow: [
                BoxShadow(
                  color: Colors.black.withOpacity(0.05),
                  blurRadius: 8,
                  offset: const Offset(0, 2),
                ),
              ],
            ),
            child: Row(
              children: [
                Container(
                  width: 60,
                  height: 60,
                  decoration: BoxDecoration(
                    color: ThemeColors.primary.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: Icon(
                    Icons.event,
                    color: ThemeColors.primary,
                    size: 24,
                  ),
                ),
                const SizedBox(width: 12),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        activity['title'] as String,
                        style: TextStyle(
                          fontSize: 14,
                          fontWeight: FontWeight.w600,
                          color: ThemeColors.textPrimary,
                        ),
                      ),
                      const SizedBox(height: 4),
                      Text(
                        activity['time'] as String,
                        style: TextStyle(
                          fontSize: 12,
                          color: ThemeColors.textSecondary,
                        ),
                      ),
                      Text(
                        activity['location'] as String,
                        style: TextStyle(
                          fontSize: 12,
                          color: ThemeColors.textSecondary,
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
                  decoration: BoxDecoration(
                    color: ThemeColors.primary.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(12),
                  ),
                  child: Text(
                    activity['status'] as String,
                    style: TextStyle(
                      fontSize: 11,
                      color: ThemeColors.primary,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ),
              ],
            ),
          )).toList(),
        ],
      ),
    );
  }

  // 文化展览页面
  Widget _buildCulturalExhibitionPage() {
    return const Center(
      child: Text(
        '文化展览功能开发中...',
        style: TextStyle(fontSize: 16),
      ),
    );
  }

  // 教育培训页面
  Widget _buildEducationTrainingPage() {
    return const Center(
      child: Text(
        '教育培训功能开发中...',
        style: TextStyle(fontSize: 16),
      ),
    );
  }

  // 社区交流页面
  Widget _buildCommunityPage() {
    return const Center(
      child: Text(
        '社区交流功能开发中...',
        style: TextStyle(fontSize: 16),
      ),
    );
  }
}